<template>
  <div class="about">
    <my-input v-model="title" @enter="add"></my-input>
    <h1>{{ title }}</h1>
    <my-list></my-list>
    <button @click="change">shixian</button>
  </div>
</template>
<script lang="ts">
//@ts-ignore
import { defineComponent, ref } from "vue";
import myInput from "../components/myInput.vue";
import myList from "../components/myList.vue";
import { useStore } from "vuex";
export default defineComponent({
  components: {
    myInput,
    myList,
  },
  setup(props) {
    const store = useStore();
    const title = ref<string>("");
    const add = () => {
      console.log(222);

      store.commit("add", {
        id: new Date().getTime(),
        //id是时间戳
        title: title.value,
        //标题
        status: "111",
        //状态
        time: new Date().toLocaleString(),
        //添加的时间
      });
    };
    const change = () => {
      store.commit("change", "aaa");
    };
    return { title, add, change };
  },
});
</script>
